<template>
  <div id="app">
    <!-- <div id="nav">
      <router-link to="/">Home</router-link> |
      <router-link to="/about">About</router-link>
    </div> -->
    <router-view />
  </div>
</template>
<script>
import base from "./utils/base.js";
import { mapActions } from "vuex";
export default {
  name: "app",
  mounted() {
    this.$store.state.windowHeight = this.getWindowHeight();
  },
  created() {
    //从localStorage里读取是否保存了vuex的数据--头部标签
    var _tags = localStorage.getItem(base.tags);
    if (_tags) {
      this.initTags(_tags);
    }
    //监听页面刷新，在页面刷新时将vuex里的信息保存到localStorage里
    window.addEventListener("beforeunload", () => {
      //用户信息
      localStorage.setItem(base.userInfo, JSON.stringify(this.$store.state.userInfo));
      //头部标签
      localStorage.setItem(base.tags, JSON.stringify(this.$store.state.tags));
    });
  },
  methods: {
    ...mapActions({
      setTags: "setTags"
    }),
    getWindowHeight() {
      return document.documentElement.clientHeight;
    },
    initTags(_tags) {
      var jsonTagsObj = JSON.parse(_tags);
      var tempTags = [];
      //除了默认页面和选中的页面，其他全部清除
      if (jsonTagsObj && jsonTagsObj.length > 0) {
        for (var i = 0; i < jsonTagsObj.length; i++) {
          if (
            jsonTagsObj[i].status == "active" ||
            jsonTagsObj[i].type == "default"
          ) {
            tempTags.push(jsonTagsObj[i]);
          }
        }
      }
      jsonTagsObj = tempTags;
      this.setTags(jsonTagsObj);
    },
    /* initState(_obj) {
      var jsonStoreObj = JSON.parse(_obj);
      var tempTags = [];
      //除了默认页面和选中的页面，其他全部清除
      if (jsonStoreObj.tags && jsonStoreObj.tags.length > 0) {
        for (var i = 0; i < jsonStoreObj.tags.length; i++) {
          if (
            jsonStoreObj.tags[i].status == "active" ||
            jsonStoreObj.tags[i].type == "default"
          ) {
            tempTags.push(jsonStoreObj.tags[i]);
          }
        }
      }
      jsonStoreObj.tags = tempTags;
      this.$store.replaceState(Object.assign(this.$store.state, jsonStoreObj));
    }, */
  },
};
</script>
<style lang="stylus">
#app
  font-family 'Avenir', Helvetica, Arial, sans-serif
  -webkit-font-smoothing antialiased
  -moz-osx-font-smoothing grayscale
  text-align center
  color #2c3e50
  height: 100%;

#nav
  padding 30px
  a
    font-weight bold
    color #2c3e50
    &.router-link-exact-active
      color #42b983

body{
  margin: 0px !important;
  height: 100%;
}
html{
  height: 100%;
}
.el-scrollbar__wrap{
  overflow-x: hidden !important;
}
.page-main-v{
  width: 100%;
  padding: 10px;
}
</style>
